<template>
  <div v-show="isShow">
    <el-input :key="componentKey" show-word-limit @blur.native.capture="validate()" v-model="value" size="small" :name="field.vModel" :disabled="isReadOnly" v-if="isShowFormatterValue==false&&field.fieldLength>0&&(field.ctrType=='text'||field.ctrType=='extend_textbox')" :maxlength="field.fieldLength" :show-password="field.entertextType=='password'" :clearable="true" :placeholder="field.fieldRemark"></el-input>
    <el-input :key="componentKey" show-word-limit @blur.native.capture="validate()" v-model="value" size="small" :name="field.vModel" :disabled="isReadOnly" v-else-if="field.fieldLength>0&&field.ctrType=='textarea'" type="textarea" :rows="field.height/10" :maxlength="field.fieldLength" :placeholder="field.fieldRemark"></el-input>

    <el-input :key="componentKey" show-word-limit @blur.native.capture="validate()" v-model="value" size="small" :name="field.vModel" :disabled="isReadOnly" v-else-if="isShowFormatterValue==false&&(field.ctrType=='text'||field.ctrType=='extend_textbox')" :show-password="field.entertextType=='password'" :clearable="true" :placeholder="field.fieldRemark"></el-input>
    <el-input :key="componentKey" show-word-limit @blur.native.capture="validate()" v-model="value" size="small" :name="field.vModel" :disabled="isReadOnly" v-else-if="field.ctrType=='textarea'" type="textarea" :rows="field.height/10" :placeholder="field.fieldRemark"></el-input>

    <el-input @focus.native.capture="changeToNormalInput" v-model="getFormatterValue" size="small" :disabled="isReadOnly" :name="field.vModel" v-if="isShowFormatterValue&&showFormat!=''&&(field.ctrType=='text'||field.ctrType=='extend_textbox')" :placeholder="field.fieldRemark"></el-input>

  </div>
</template>

<script>
  export default {
    name: "f2bpm-textbox",
    components: {},
    props: ['field', 'fieldvalue'],
    data: function () {
      return {
        fieldName: "",
        componentKey: "502",
        //是否为千分位
        isQianFenWei: false,
        //是否为大写金额
        isDaxiejine: true,
        //显示格式
        showFormat: "",
        //当前是否为格式化显示
        isShowFormatterValue: false,
        //小数位
        fieldDecimalLen: -1,
        // 校验的输入类型
        fieldDataType: '',
        isView: false,
        isShow: true,
        isReadOnly: false,
        isSubTable:false,
        value: ''
      };
    },
    watch: {
      value: {
        handler(val, oleV) {
          var that = this;
          if (val != undefined && oleV != undefined && f2grid_global_mainVueLoadComplated) {
            this.$emit('updatevalue', that.field, val);
          }
        },
        // 当值第一次绑定的时候，不会执行监听函数,第一次时值为undefined
        immediate: false
      },
      fieldvalue: {
        handler(newV, oleV) {
          var that = this;
          if (newV != undefined && oleV != undefined && f2grid_global_mainVueLoadComplated) {
            that.value = newV;
          }
        },
        immediate: false
      }
    },
    computed: {
      getFormatterValue() {
        var that = this;
        if (that.isQianFenWei) {
          return Object.toQianfenWeiStr(that.value);
        } else if (that.isDaxiejine) {
          return Object.toChinaNum(that.value);
        }
      }
    }
    , created: function () {
      var that = this;
      if (that.fieldvalue == undefined || that.fieldvalue == null) {
        that.value = "";
      } else {
        that.value = that.fieldvalue;
      }
      that.fieldName = that.field.vModel;
      that.fieldDataType = that.field.fieldDataType;
      that.fieldDecimalLen = that.field.fieldDecimalLen;
      that.initailFieldOption();
      var showFormat = that.showFormat;
      if (showFormat && showFormat == 'qianfenwei') {
        that.isQianFenWei = true;
      }
      else if (showFormat && showFormat == 'daxiejine') {
        that.isDaxiejine = true;
      }
      var formAction = WFContext.WorkflowformAction;
      that.isView = formAction > 2;
      if (that.isView) {
        that.isReadOnly = true;
      }
      else if (that.field._isReadOnly == true) {
        that.isReadOnly = true;
      }
      if (that.showFormat != "" && that.showFormat != undefined) {
        that.isShowFormatterValue = true;
      }
    }
    , mounted() {
      var that = this;
      //FUI.F2Grid.excuteFieldWritePowerByVueFormItem(that)
      // 公式结果字段不可编辑
      if (that.field.countRule && that.field.countRule.rowmath != '') {
        that.isReadOnly = true;
      }
    },
    methods: {
      initailFieldOption() {
        var that = this;
        var ctrType = that.field.ctrType;
        if (WFContext.isDesign == true) {
          return false;
        }
        if (that.field.fieldOptions) {
          var fieldOptions = typeof that.field.fieldOptions === 'string' ? eval('(' + that.field.fieldOptions + ')') : that.field.fieldOptions;
          var general = fieldOptions.find(a => a.opttype == 'general');
          if (general) {
            var kvData = general.params.kvData;
            if (ctrType == "text") {
              var item = kvData.find(a => a.key == 'showFormat');
              if (item) {
                that.showFormat = item.value || "";
              }
            }
          }
        } else if (ctrType == 'extend_textbox') {
          that.showFormat = that.field.showFormat || "";
        }
      }
      , isValidateNumber() {
        var that = this;
        if (that.fieldDataType == 'floatNumber' || that.fieldDataType == 'biggerZero' || that.fieldDataType == 'biggerOrEqualZero' || that.fieldDataType == 'litterOrEqualZero') {
          return true;
        }
        return false;
      }
      , changeToNormalInput(e) {
        var that = this;
        if (that.isReadOnly) {
          return false;
        }
        let dom = e.target;
        let parentDom=$(dom).parent().parent();
        that.isShowFormatterValue = false;
        setTimeout(function () {
          $("input[type='text']",parentDom).focus();
        }, 300);
      }
      , validate() {
        var that = this;
        var fieldDef = that.field;
        var fieldValue = that.value;
        if (!Object.toIsEmpty(fieldValue)) {
          var isPass = FUI.validateSingleField(fieldDef, fieldValue, null, true);
          if (isPass != false) {
            if (that.isValidateNumber(fieldValue) && Object.toIsNumber(fieldValue) && that.fieldDecimalLen != undefined && that.fieldDecimalLen != -1) {
              fieldValue = (Number(fieldValue)).toFixed(that.fieldDecimalLen);
              that.value = fieldValue;
            }
            var funcName = fieldDef.vModel.replace(/\./g, '_');
            if (Object.toIsExitsFunction(funcName)) {
              window[funcName](fieldValue, fieldDef);
            }
            if (that.showFormat != "") {
              that.isShowFormatterValue = true;
            }
          }
        }
      }

    }
  }
</script>